// 获取所有需要的元素
const showDivs = document.querySelectorAll('.showDiv_625wj');
const thumbnails = document.querySelectorAll('.hd_625wj ul li');
const prevBtn = document.querySelector('.prev_625wj');
const nextBtn = document.querySelector('.next_625wj');
let currentIndex = 0;
let timer = null;

// 显示指定索引的轮播图
function showSlide(index) {
    // 隐藏所有轮播图
    showDivs.forEach(div => div.style.display = 'none');
    // 移除所有缩略图的激活状态
    thumbnails.forEach(thumb => thumb.className = '');
    
    // 显示当前索引的轮播图
    showDivs[index].style.display = 'block';
    // 激活当前索引的缩略图
    thumbnails[index].className = 'on';
    
    currentIndex = index;
}

// 显示下一张
function showNext() {
    let nextIndex = currentIndex + 1;
    if (nextIndex >= showDivs.length) {
        nextIndex = 0;
    }
    showSlide(nextIndex);
}

// 显示上一张
function showPrev() {
    let prevIndex = currentIndex - 1;
    if (prevIndex < 0) {
        prevIndex = showDivs.length - 1;
    }
    showSlide(prevIndex);
}

// 自动播放
function startAutoPlay() {
    timer = setInterval(showNext, 3000);
}

// 停止自动播放
function stopAutoPlay() {
    clearInterval(timer);
}

// 绑定事件
prevBtn.addEventListener('click', () => {
    showPrev();
    stopAutoPlay();
    startAutoPlay();
});

nextBtn.addEventListener('click', () => {
    showNext();
    stopAutoPlay();
    startAutoPlay();
});

// 为缩略图添加点击事件
thumbnails.forEach((thumb, index) => {
    thumb.addEventListener('click', () => {
        showSlide(index);
        stopAutoPlay();
        startAutoPlay();
    });
});

// 鼠标悬停时停止自动播放
document.querySelector('.foucebox_625wj').addEventListener('mouseenter', stopAutoPlay);
document.querySelector('.foucebox_625wj').addEventListener('mouseleave', startAutoPlay);

// 初始化显示第一张
showSlide(0);
// 开始自动播放
startAutoPlay(); 